<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>媒体查询</title>

  <link rel="stylesheet" href="./css/h2.css">

</head>

<body>

  <div class="desktop">电脑版本</div>
  <div class="phone">手机版本</div>

  <!-- 自适应相册效果 -->
  <div class="images-box">

    <div>
      <img src="./images/bataman0001.jpg" alt="">
      <div>图片一</div>
    </div>

    <div>
      <img src="./images/bataman0002.jpg" alt="">
      <div>图片二</div>
    </div>

    <div>
      <img src="./images/bataman0004.jpg" alt="">
      <div>图片三</div>
    </div>


    <div>
      <img src="./images/bataman0005.jpg" alt="">
      <div>图片四</div>
    </div>

    <div>
      <img src="./images/bataman0006.jpg" alt="">
      <div>图片五</div>
    </div>

    <div>
      <img src="./images/bataman-03.jpg" alt="">
      <div>图片六</div>
    </div>

    <div>
      <img src="./images/bataman-04.jpg" alt="">
      <div>图片七</div>
    </div>

  </div>


</body>

</html>